<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网页设计</title>
<meta charset="utf-8">
<style>
* {
  box-sizing: border-box;
}

body {
  margin: 0;
}
.column {
  float: left;
  width: 100%;
}
/* 头部样式 */
.header {
  background-color:grey;
  padding: 10px;
  text-align: center;
  color: white;
}

/* 导航条 */
.topnav {
  list-style-type: none;
  overflow: hidden;
  background-color: #333;
  margin:0;
	padding:0;
}
 
/* 导航链接 */
.topnav a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}
.topnav a.active {
    background-color: #4CAF50;
    color: white;
    border-radius: 25px;
}

/* 链接 - 修改颜色 */
.topnav a:hover:not(active) {
  background-color: #ddd;
  color: black;
  border-radius: 25px;
}

a
{
    display:block;
    width:155px;
}



.dropdown {
  position: absolute;
  display: inline-block;
}

.dropdown-content {
    display: none;
    position:absolute;
    background-color: #f9f9f9;
    min-width: 100;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    border-radius: 25px;
}
.dropdown-content a {
    color: black;
  
    width:155x;
    
    display:block;
}
.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
    display: block;
}

body {background-color:#b0c4de;}
.footer {
  background-color: #f1f1f1;
  padding: 10px;
  text-align: center;
}
</style>
</head>
<body>

<div class="header">
  <h1>
    狗狗之家</h1>
    <img src="https://uploadfile.huiyi8.com/2018/af/6c/66/35/412054.jpg" alt="狗狗大全" width="200" height="200">
</div>
 
<div class="topnav">
    <a  href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/runoob.html">首页</a>
    <a href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/Untitled-1.html">狗狗大全</a>
    <div class="dropdown">
        <a class="active" href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/Untitled-2.html">狗粮</a>
                <div class="dropdown-content">
            <a href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/%E6%B3%A8%E6%84%8F%E4%BA%8B%E9%A1%B9.html">狗粮选择注意事项</a>
            <a href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/%E5%8D%81%E5%A4%A7%E7%8B%97%E7%B2%AE.html">十大狗粮</a>
          </div>
        </div>
    <a  href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/Untitled-3.html">狗狗日常用品</a>
    <a  href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/Untitled-3.html">狗狗日常用品</a>
    <a  href="file:///D:/%E6%A1%8C%E9%9D%A2/runoob/%E8%A1%A8%E5%8D%95.html" style="float:right">意见反馈</a>
  </div>
  <h3>狗粮选择注意事项</h3>
  <p>1.在选择狗粮时，要做到不要盲目跟风，不一定贵的就一定好，做到买时看成分。选择狗粮时要注意一下几点。

    首先颜色不是判断标准，花花绿绿要谨慎，狗粮中主要以肉类为主，颜色可能要比其他的肉少的狗粮颜色要深一些，但是不是花花绿绿的，所以要注意。二是以肉为主的狗粮，狗粮的质地会紧实一些，并且会有一点硬度，狗狗咀嚼时会发出清脆的声音，并且很容易碎。如果选择的狗粮很光滑很细腻的感觉，不一定是好狗粮，如果再加之狗粮泛起了油光，这就说明狗粮很粘牙，这对狗狗的牙齿很不健康，三是选择狗粮时可以尝尝，如果咸的话，要谨慎购买。盐对狗狗的健康不是很好，因为一些商家为了提高适口性，会添加过量的盐，狗狗喜欢吃，但是对狗狗的健康不是很好。四是闻起来很香的狗粮要谨慎，可能是添加诱食剂，这可能会出现一些不正常掉毛的问题等，也可能危害狗狗的肝脏健康问题。</p>
    <img src="https://pic3.zhimg.com/80/v2-bba9f8a57d5ebfca666a0ac1f18117ce_1440w.jpg" alt="狗狗大全" width=auto height=auto>
    <p>
    </p>
    <p></p>
    <div class="footer">
        <img src="https://tse4-mm.cn.bing.net/th/id/OIP-C.6oOKw7TgzTGKMz9lELv9xQHaHa?w=170&h=180&c=7&r=0&o=5&dpr=1.65&pid=1.7" alt="狗狗大全" width="50" height="50">
      </div>
</body>
</html>